/*
 * @Author: your name
 * @Date: 2021-05-19 17:47:55
 * @LastEditTime: 2021-05-29 16:40:34
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /xiangpan-admin/src/pages/staff/index.tsx
 */
import { IForm } from '@/components/form/interface';
import { Button, Card, Space, Table, Tag, Modal } from 'antd';
import React, { useState } from 'react';
import GoodsModal from './goodsModal';
import { IFormTypeEnum } from '@/components/form/formComponent';
import HeaderForm from '@/components/form';
import { PlusOutlined } from '@ant-design/icons';
import useObj from '@/use/useObj';
interface IProps {}

const Goods = (props: IProps) => {
  const [obj, setObj] = useObj({
    visible: false,
  });
  const columns: IForm[] = [
    {
      key: 'goods_name',
      dataIndex: 'goods_name',
      title: '商品名称',
    },
    {
      key: 'goods_price',
      dataIndex: 'goods_price',
      title: '价格',
    },
    {
      key: 'goods_inventory',
      dataIndex: 'goods_inventory',
      title: '库存',
    },
    {
      key: 'create_time',
      dataIndex: 'create_time',
      title: '创建时间',
    },
    {
      key: 'opt',
      dataIndex: 'opt',
      title: '操作',
      render: (text, record) => {
        return (
          <Space>
            <Button type="link">编辑</Button>
            <Button
              type="link"
              onClick={() => {
                Modal.confirm({
                  onOk: () => {},
                });
              }}
            >
              删除
            </Button>
          </Space>
        );
      },
    },
  ];

  const List = [
    {
      key: 'goods_name',
      type: IFormTypeEnum.Input,
      label: '商品名称',
    },
  ];
  return (
    <Card title="商品管理">
      <div className="flex-between">
        <HeaderForm
          list={List}
          layout="inline"
          style={{ margin: '10px 0' }}
          onSubmit={(form) => {
            console.log(form, 'form==');
          }}
        />
        <Button
          type="primary"
          icon={<PlusOutlined />}
          style={{ marginBottom: 15 }}
          onClick={() => {
            setObj({ visible: true });
          }}
        >
          添加商品
        </Button>
      </div>

      <Table columns={columns} dataSource={[]} />
      <GoodsModal
        visible={obj.visible}
        close={() => setObj({ visible: false })}
      />
    </Card>
  );
};
export default Goods;
